/* 最大的框 ul*/
.bottom{
    height: 20vw;
    width: 100%;
    background-color: #fff;
}
.fixed{
    height: 15vw;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    box-sizing: border-box;
    border-top: 0.1vw solid rgb(182, 181, 181);
    position: fixed;
    bottom: 0;
    background-color: #fff;
}
.bottom-index{
    display: flex;
    justify-content: center;
    align-items: center;
    
}
.index-1-bg{
    background-color: #ffd006;
    width: 10vw;
    height: 10vw;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.index-1-text{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 4vw;
    font-weight: 600;
}
/* 其他 */
.bottom-others{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.index-img{
    width: 7vw;
    height: 7vw;
}
.index-text{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2vw;
    margin-top: 1vw;
}


/* <!-- 底部导航栏 -->
    <div class="bottom">
        <ul class="fixed">
            <li class="bottom-index">
                        <div class="index-1-bg">
                            <p class="index-1-text">美团</p>
                        </div>
                    </li>
                    <li class="bottom-others">
                        <img src="/icon/bottom/电商.png" alt="电商" class="index-img">
                        <p class="index-text">电商</p>
                    </li>
                    <li class="bottom-others">
                        <img src="/icon/bottom/文本.png" alt="消息" class="index-img">
                        <p class="index-text">消息</p>
                    </li>
                    <li class="bottom-others">
                        <img src="/icon/bottom/购物车.png" alt="购物车" class="index-img">
                        <p class="index-text">购物车</p>
                    </li>
                    <li class="bottom-others">
                        <img src="/icon/bottom/我的.png" alt="我的" class="index-img">
                        <p class="index-text">我的</p>
                    </li>
                </ul>
        </ul>
    </div> */